<template>

	<view>
		<bg-video></bg-video>
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="content">门店新增</block>
		</cu-custom>
		<form>
			<view class=" bg-white padding">
				<view class="bg-white">
					<view class="cu-form-group solid">
						<view class="title">门店名：</view>
						<input placeholder="请输入门店名" v-model="md.sname"></input>
					</view>
					<!-- <view class="margin-top solid">
						<view class="cu-form-group">
							<view class="title">营业执照：</view>
						</view>
						<yyzz-update v-model="md.yyzz" :idKey="md.storeid" />
					</view> -->
					<view class="cu-form-group margin-top solid">
						<view class="title">位置：</view>
						<view>
							<text @click="sp = true;">
								<text class="" v-if="md.pcode">{{cmap[md.pcode].criname}}</text>
								<text class="" v-if="md.scode">{{cmap[md.scode].criname}}</text>
								<text class="" v-if="md.qcode">{{cmap[md.qcode].criname}}</text>
								<text v-else>请选择</text>
								<text class="cuIcon-right"></text>

							</text>
						</view>
					</view>
					<view class="cu-form-group align-start margin-top solid">
						<view class="title">详细地址：</view>
						<textarea v-model="md.address" placeholder="请输入详细地址"></textarea>
					</view>

					<!-- 上传封面-->
					<view class="margin-top solid">
						<view class="cu-form-group">
							<view class="title">封面：</view>
						</view>
						<cover-update v-if="md.storeid != null" v-model="md.cover" :idKey="md.storeid" />
					</view>
					<!-- 上传图片相册 -->
					<view class="margin-top solid">
						<img-update v-if="md.storeid != null" :idKey="md.storeid" class="margin-top" v-model="md.imgs"
							:size="4" />
					</view>

					<!-- 设施服务 -->
					<view class="margin-top bg-white padding solid">
						<view><text>设施服务:</text></view>
						<view class="grid col-3">
							<view class="padding-top">
								<label class="flex align-stretch" @tap="md.gys = !md.gys">
									<text class="text-xl"><text class="text-blue"
											:class="md.gys ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text></text>
									<text>更衣室</text>
								</label>
							</view>
							<view class="padding-top">
								<label @tap="md.ly = !md.ly" class="flex align-stretch ">
									<text class="text-xl">
										<text class="text-blue"
											:class="md.ly ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
									</text>
									<text class="">淋浴室</text>
								</label>
							</view>
							<view class="padding-top">
								<label @tap="md.cs = !md.cs" class="flex align-stretch ">
									<text class="text-xl">
										<text class="text-blue"
											:class="md.cs ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
									</text>
									<text class="">卫生间</text>
								</label>
							</view>
							<view class="padding-top">
								<label @tap="md.kt = !md.kt" class="flex align-stretch ">
									<text class="text-xl">
										<text class="text-blue"
											:class="md.kt ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
									</text>
									<text class="">空调</text>
								</label>
							</view>
							<view class="padding-top">
								<label @tap="md.wifi = !md.wifi" class="flex align-stretch ">
									<text class="text-xl">
										<text class="text-blue"
											:class="md.wifi ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
									</text>
									<text class="">无线网</text>
								</label>
							</view>
							<view class="padding-top">
								<label @tap="md.yys = !md.yys" class="flex align-stretch ">
									<text class="text-xl">
										<text class="text-blue"
											:class="md.yys ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
									</text>
									<text class="">饮用水</text>
								</label>
							</view>
						</view>
					</view>

					<view class="cu-form-group solid margin-top">
						<view class="title">保洁周期：</view>
						<view class="flex justify-end align-center">
							<zqs-select :list="bjList" v-model="md.bj" labelKey="value" valueKey="code"></zqs-select>
						</view>
					</view>
					
					<view class="cu-form-group solid margin-top">
						<view class="title">门店类型：</view>
						<view class="flex justify-end align-center">
							<zqs-select :list="mdtypes" v-model="md.storetype" labelKey="value" valueKey="code"></zqs-select>
						</view>
					</view>
					
					<view class="cu-form-group solid margin-top">
						<view class="title">楼层：</view>
						<view class="flex justify-end align-center">
							<zqs-select :list="floors" v-model="md.floor" labelKey="value" valueKey="code"></zqs-select>
						</view>
					</view>
					
					<view class="cu-form-group solid">
						<view class="title">面宽：</view>
						<input placeholder="请输入面宽" v-model="md.width"></input>
					</view>
					
					<view class="cu-form-group solid">
						<view class="title">进深：</view>
						<input placeholder="请输入进深" v-model="md.depth"></input>
					</view>
					
					<view class="cu-form-group solid">
						<view class="title">层高：</view>
						<input placeholder="请输入层高" v-model="md.height"></input>
					</view>
					
					<view class="cu-form-group solid">
						<view class="title">总面积：</view>
						<input placeholder="请输入层高" v-model="md.totalarea"></input>
					</view>
					
					<view class="margin-top solid">
						<view class="cu-form-group flex justify-between align-center">
							<view class="title">设备邮寄地址：</view>
							<view @tap="changeDzFlg" class="h-100 flex align-center">
								<text class="text-xl text-blue">
									<text  :class="sbyjxx.ismd ? 'cuIcon-squarecheckfill' : 'cuIcon-square'"></text>
								</text>
								<text class="">与门店地址相同</text>
							</view>
						</view>
						<view>
							<view v-if="!sbyjxx.ismd" class="padding-sm">
								<textarea v-model="sbyjxx.address" placeholder="请输入详细地址"></textarea>
							</view>
							<view class="padding-sm">
								<input v-model="sbyjxx.person" placeholder="请输入收件人姓名"></input>
							</view>
							<view class="padding-sm">
								<input v-model="sbyjxx.tel" placeholder="请输入收件人电话"></input>
							</view>
						</view>
					</view>
				</view>

			</view>
			<view class="padding ">
				<button @click="shezhi" class="cu-btn block bg-blue lg">提交</button>
			</view>
		</form>
		<md-position v-if="sp" @change="adChange" @close="sp = false" :astore="md" />
	</view>
</template>

<script>
	import mdposition from "@/components/md-position.vue";
	export default {
		components: {
			"md-position": mdposition
		},
		data: function() {
			return {
				sp: false,
				akey: "",
				sbyjxx: {
					ismd: false,
					address: "",
					person: "",
					tel: ""
				},
				md: {
					storeid: this.common.generateID("MD"), //门店id
					sname: "", //门店名
					jd: "", //经度
					wd: "", //纬度
					imgs: [],
					akey: "",
					cover: "", //封面
					dzid: this.store.state.dz.dzid, //店长id
					address: "",
					ly: false, //淋浴间
					kt: false, //空调
					gys: false, //更衣室
					cs: false, //卫生间
					wifi: false, //
					yys: false, //饮用水
					bj: "", //保洁
					storetype: "",
					floor: 1,
					width: 0,
					depth: 0,
					height: 0,
					totalarea: 0,
				},
				cmap: this.location.localmap.cmap,
				bjIndex: 0,
				mdtypes: [],
				bjList: [],
				floors: [],

			};
		},
		
		created: function() {
			this.constant.get("MDTYPE").then(data => {
				this.mdtypes = data.dicts;
			});
			this.constant.get("FLONUM").then(data => {
				this.floors = data.dicts;
			});
			this.constant.get("BJTP").then(data => {
				this.bjList = data.dicts;
			});
		},
		
		onLoad: function() {
			
		},

		onShow: function() {
		},

		methods: {
			newMd: function() {
				return this.api("/md/info").send({
					astore: this.md,
				}).then(data => {
					this.md = data.astore;
				});
			},
			saveMd: function() {
				this.api("/md/info/put").send(this.md).then(data => {
					this.message.info("修改成功");
				});
			},

			renling: function() {
				if (!this.akey) {
					this.message.error("请输入认领密钥");
					return;
				}

				if (this.akey != this.md.akey) {
					this.message.error("请输密钥不正确");
					return;
				}

				this.md.stu = "C";

				this.api("/md/info/put").send(this.md).then(data => {
					this.message.info("认领成功");
				});
			},

			shezhi: function() {
				if (!this.md.sname) {
					this.message.error("请填写门店名");
					return;
				}
				
				if (!this.md.jd) {
					this.message.error("请选择门店位置");
					return;
				}
				
				if (!this.md.address) {
					this.message.error("请填写门店地址");
					return;
				}
				
				if (!this.md.cover) {
					this.message.error("请上传门店封面");
					return;
				}

				// if (!this.md.yyzz) {
				// 	this.message.error("请上传场地使用证明");
				// 	return;
				// }
				
				if (!this.sbyjxx.address) {
					this.message.error("请设置设备邮寄地址");
					return;
				}
				
				if (!this.sbyjxx.person) {
					this.message.error("请设置设备邮寄收件人");
					return;
				}
				
				if (!this.sbyjxx.tel) {
					this.message.error("请设置设备邮寄收件人电话");
					return;
				}

				this.md.stu = "R";
				this.md.sbyjxx = JSON.stringify(this.sbyjxx);
				this.newMd().then(() => {
					this.message.info("提交成功，等待审核。");
					uni.navigateBack();
				});
				// this.api("/md/info/put").send(this.md).then(data => {
				// 	this.message.info("提交成功，等待审核。");
				// 	uni.navigateBack();
				// });
			},

			adChange: function(md) {
				this.md.pcode = md.pcode;
				this.md.scode = md.scode;
				this.md.qcode = md.qcode;
				this.md.address = md.address;
				this.md.jd = md.jd;
				this.md.wd = md.wd;
				this.sp = false;
			},
			
			changeDzFlg: function() {
				this.sbyjxx.ismd = !this.sbyjxx.ismd;
				if (this.sbyjxx.ismd) {
					this.sbyjxx.address = this.md.address;
				} else {
					this.sbyjxx.address = "";
				}
			}

		}
	}
</script>

<style scoped>
	.roomtitle {
		position: absolute;
		bottom: 0;
		width: 100%;
		display: flex;
		align-items: start;
		min-height: 100rpx;
		justify-content: space-between;
		flex-direction: column;
	}

	.roomtitle text {
		padding: 0.3rem;
	}
</style>